import React, { FC } from 'react';
import { Icon } from 'antd-mobile';
import { LOAD_MORE_ID } from '@/emuns';
import { ILoadMoreProps } from '@/interface';

import './index.less';

const LoadMore: FC<ILoadMoreProps> = props => {
  const {
    show,
    id = LOAD_MORE_ID,
    loadText = '加载中...(loading)',
    endText = '我是有底线的~(end)',
  } = props;
  return (
    <div className="load-more-wrap">
      {show ? (
        <div id={id}>
          <Icon className="icon" type="loading" />
          <span className="desc">{loadText}</span>
        </div>
      ) : (
        <span className="desc">{endText}</span>
      )}
    </div>
  );
};

export default LoadMore;
